@keyframes slideInLeft {
    0% {

        transform: translateX(-100%) scale(var(--scale-factor));
        transform-origin: right top !important;
        opacity: 0;
    }

    100% {
        transform: translateX(0) scale(var(--scale-factor));
        transform-origin: right top !important;
        opacity: 1;
    }
}

.slide-in-left {
    transform-origin: top left !important;
    animation-name: slideInLeft;
    animation-duration: 1s;
    /* 动画持续时间 */
    animation-timing-function: ease-out;
    /* 动画速度曲线 */
    animation-fill-mode: both;
    /* 让动画在开始前和结束后保持最后一帧 */
}

@keyframes slideInRight {
    0% {
        transform: translateX(100%) scale(var(--scale-factor));
        opacity: 0;
    }

    100% {
        transform: translateX(0%) scale(var(--scale-factor));
        opacity: 1;
    }
}

.slide-in-right {
    transform-origin: top right !important;
    animation-name: slideInRight;
    animation-duration: 1s;
    /* 动画持续时间 */
    animation-timing-function: ease-out;
    /* 动画速度曲线 */
    animation-fill-mode: both;
    /* 让动画在开始前和结束后保持最后一帧 */
}

.slide-in-left-leave {
    transform-origin: top left !important;
    animation-name: slideInLeftLeave;
    animation-duration: 0.2s;
    /* 动画持续时间 */
    animation-timing-function: ease-out;
    /* 动画速度曲线 */
    animation-fill-mode: both;
    /* 让动画在开始前和结束后保持最后一帧 */
}

@keyframes slideInLeftLeave {
    0% {
        transform: translateX(0%) scale(var(--scale-factor));
        opacity: 1;
    }

    100% {
        transform: translateX(-100%) scale(var(--scale-factor));
        opacity: 0;
    }
}

@keyframes slideInRightLeave {
    0% {
        transform: translateX(0%) scale(var(--scale-factor));
        opacity: 1;
    }

    100% {
        transform: translateX(100%) scale(var(--scale-factor));
        opacity: 0;
    }
}

.slide-in-right-leave {
    transform-origin: top right !important;
    animation-name: slideInRightLeave;
    animation-duration: 0.2s;
    /* 动画持续时间 */
    animation-timing-function: ease-out;
    /* 动画速度曲线 */
    animation-fill-mode: both;
    /* 让动画在开始前和结束后保持最后一帧 */
}